<!--分散式房源基础信息编辑表单-->
<template>
	<a-tabs v-model:activeKey="activeTab" v-bind="options">
		<a-tab-pane key="basic" tab="基础信息">
			<house-distributed-base-form :value="value" @next="activeTab = 'extra'" />
		</a-tab-pane>
		<a-tab-pane key="extra" tab="推广信息" :disabled="!value.id || value.transform">
			<house-distributed-extra-form :value="value" />
		</a-tab-pane>
	</a-tabs>
</template>

<script lang="ts" setup>
	import {reactive, ref} from 'vue'
	import {HouseBase} from '@/interface/house'
	import HouseDistributedBaseForm from '@/components/house/edit/distributed/house-distributed-base-form.vue'
	import HouseDistributedExtraForm from '@/components/house/edit/distributed/house-distributed-extra-form.vue'

	const props = defineProps<{
		value: HouseBase
	}>()

	const activeTab = ref('basic')

	const options = reactive({
		tabPosition: 'left',
		class: 'house-form-tabs',
		destroyInactiveTabPane: true
	})
</script>

<style lang="less" scoped>
	.house-form-tabs {
		.ant-tabs-tabpane {
			padding: 0 24px;
			min-width: 1000px;
		}
	}
</style>
